<template>
    <div class="ec-app-container">
        <!-- 查询条件 -->
        <div class="filter-container">
            <el-form label-width="90px">
                <el-row :gutter="10">
                    <el-col :span="6">
                        <el-form-item label="角色名称：" >
                            <el-input v-model="listQuery.title" placeholder="角色名称"/>
                        </el-form-item>
                    </el-col>
                    <el-col :span="6">
                    <el-form-item label="角色状态：" >
                        <el-input v-model="listQuery.title" placeholder="角色状态"/>
                    </el-form-item>
                </el-col>
                    <el-col :span="6" class="text-center">
                        <el-button type="primary" class="border-4C7FD7 color-4C7FD7" icon="el-icon-search" @click="searchList">查询</el-button>
                        <el-button class="border-4C7FD7 color-4C7FD7" @click="resetSearch">重置</el-button>
                    </el-col>
                </el-row>
            </el-form>
        </div>
        <!-- table -->
        <div>
            <div class="mt-30">
                <el-button class="filter-item" type="primary" @click="toPath('')">新增</el-button>
            </div>
            <div class="mt-20">
                <el-table
                        v-loading="listLoading"
                        :data="list"
                        border
                        fit
                        highlight-current-row
                        @selection-change="handleSelectionChange"
                        style="width: 100%;">
                    <el-table-column prop="" label="角色名称" align="center"></el-table-column>
                    <el-table-column prop="" label="创建时间" align="center"></el-table-column>
                    <el-table-column prop="" label="更新时间" align="center"></el-table-column>
                    <el-table-column prop="" label="角色状态" align="center"></el-table-column>
                </el-table>
            </div>
            <pagination v-show="total>0" :total="total" :page.sync="listQuery.pageNum" :limit.sync="listQuery.pageSize" @pagination="searchList" />
        </div>
    </div>
</template>

<script>
    import Pagination from '@/components/Pagination' // Secondary package based on el-pagination、
    export default {
        name: 'Project',
        components: {
            Pagination
        },
        data() {
            return {
                listQuery: {
                    title: '',
                    pageSize: 10,
                    pageNum: 1
                }
            }
        },
        created() {

        },
        methods: {}
    }
</script>

<style scoped>

</style>